
<template>
  <el-container class="bg_img1">
    <el-main class="bg_size1">
      <h1 class="ZC">您的选座信息</h1>
      <el-form
        :model="ruleForm"
        :rules="rules"
        ref="ruleForm"
        class="demo-ruleForm"
        label-position="left"
        label-width="120px"
      >
      <el-row>
          <el-col :span="8" :offset="8">
            <el-form-item label="具体楼层号" prop="fno" class="item">
              <el-input
                v-model="ruleForm.list.fno"
                disabled
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="8" :offset="8">
            <el-form-item label="具体教室号" prop="rno" class="item">
              <el-input
                v-model="ruleForm.list.rno"
                disabled
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="8" :offset="8">
            <el-form-item label="座位号" prop="sno" class="item">
              <el-input
                v-model="ruleForm.list.sno"
                disabled
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="8" :offset="8">
            <el-form-item label="选座日期" prop="datename" class="item">
              <el-input
                v-model="ruleForm.datename"
                disabled
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="8" :offset="8">
            <el-form-item label="选座时间段" prop="timename" class="item">
              <el-input
                v-model="ruleForm.timename"
                disabled
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="8" :offset="7">
            <el-form-item class="item">
              <el-button type="primary" size="large"
                @click="show()"
              >查看订座信息</el-button>

              <el-button type="primary" size="large"
                @click="reset()"
              >取消订座</el-button>
            </el-form-item>

          </el-col>
        </el-row>

      </el-form>
    </el-main>
  </el-container>
</template>
<script>
import axios from "axios";
import qs from "querystring";
import store from "../store";

export default {
  name: "ShowMessageVue",
  data() {
    return {
      ruleForm: {
        list: [{}],
        datename: "",
        timename: "",
      },
    }
  },

  methods: {
    show() {
      let id = this.$store.state.accountInfo.oid;
      console.log(id);
      let s = {id: id}
      axios
        .post(
          "http://localhost:8080/library/findOrder",
          qs.stringify(s),
          {
            headers: {
              "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
            },
          }
        )
        .then((res) => {
          console.log(res.data);
          if (res.data.code == 1) {
            this.ruleForm.list = res.data.data;
            this.ruleForm.datename = this.$store.state.timeInfo.datename;
            this.ruleForm.timename = this.$store.state.timeInfo.timename;
            window.alert("若想重新选座，请取消订座后进行操作！");
          } else {
            console.log("error");
          }
        });

    },

    reset() {
      let id = this.$store.state.accountInfo.id;
      let oid = this.$store.state.accountInfo.oid;
      let sno = this.$store.state.seatInfo.sno;
      let fno = this.$store.state.seatInfo.fno;
      let rno = this.$store.state.seatInfo.rno;

      console.log(id,oid,sno,fno,rno);

      axios
        .post(
          "http://localhost:8080/library/resetSeat",
          qs.stringify({ id,oid,sno,fno,rno }),
          {
            headers: {
              "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
            },
          }
        )
        .then((res) => {
          console.log(res.data);
          if (res.data.code == 1) {
            window.alert("成功取消订座，可重新订座！");
            this.ruleForm.list = [{}];
            this.ruleForm.datename = "";
            this.ruleForm.timename = "";
            this.$store.commit("setAccountOId","");
            console.log(this.$store.state.accountInfo.oid);
          } else {
            console.log("error");
          }
        });

    }

  }
}
</script>

<style scoped>
.ZC {
  font-size: 30px;
  margin-left: 40%;
  color: rgb(150, 172, 192);
}
.msg {
  color: red;
  margin-bottom: 15px;
}
</style>
